<template>
    <div>
        <van-field
        :label="label" 
        :placeholder="placeholder" 
        :type="type"
        v-model="content"
        @input="handleInput"
        />
    </div>
</template>
<script>
export default {
    props:['label','placeholder' ,'type' ,'rule'],
    data(){
        return{
            content:"",
        }
    },
    methods:{
        handleInput(){
            const rue = new RegExp(this.rule)
            if(rue.test(this.content)){
                this.$emit('inputChange', this.content)
            }
        }
    },
    watch:{
        content() {
            this.handleInput()
        }
    }
}
</script>
<style lang="scss">
    
</style>